<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document1205</title>
</head>
<style>
  .box {
    width: 200px;
    height: 200px;
    background-color: skyblue;
    line-height: 200px;
    text-align: center;
    position: absolute;
  }

  li {
    cursor: pointer;
  }

  main {
    position: relative;
  }

  .active {
    z-index: 1;
  }
</style>

<body>
  <div id="app">
    <ol>
      <li v-for="(o,i) in title" @click="change(i)">{{ o.item }}</li>
    </ol>
    <main>
      <div :class="['box']" v-for="(o,i) in contents">{{o.item}}</div>
    </main>
  </div>
</body>

</html>